<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="../../static/css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../../static/css/iconfont.css" />

	</head>

	<body>
		<div class="mui-navbar-inner mui-bar mui-bar-nav">
			<button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
				<span class="mui-icon mui-icon-left-nav"></span>
			</button>
			<h1 class="mui-center mui-title">购物</h1>
		</div>


		<input type="" name="ItemID" id="ItemID" value="123456" hidden="true"/>
		<br>
		<br>
		<div id="slider" class="mui-slider">
			<div class="mui-slider-group">
			{{range .SliderPs}}
				<div class="mui-slider-item">
					<a href="">
						<img src="{{.Imgsrc}}">
					</a>
				</div>
			{{end}}
				<div class="mui-slider-indicator">
					{{range $k , $v := .SliderPs}}
						{{if eq $k 0}}
							<div class="mui-indicator mui-active"></div>
						{{else}}
							<div class="mui-indicator"></div>
						{{end}}
					{{end}}
				</div>
			</div>
		</div>

		<div>
			<h4>{{.GoodsInfo.Name}}</h4>
			<h5 style="line-height: 20px;">{{.GoodsInfo.Content}}</h5>
		</div>

		<div >
			<h4 style="font-size:25px;color: red;line-height: 40px;">￥<lable>{{.GoodsInfo.Price}}</lable></h4>

			<div>
				<lable>
					<b>购买数量：</b>
					</lable>
				<div class="mui-numbox" data-numbox-step='1' data-numbox-min='1' style="margin-left: 60px;">
					<button class="mui-btn mui-numbox-btn-minus" type="button">-</button>
					<input id="count" class="mui-numbox-input" type="number" value="1" />
					<button class="mui-btn mui-numbox-btn-plus" type="button">+</button>
				</div>
			</div>
		</div>

		<div class="mui-content">
			<ul class="mui-table-view mui-table-view-striped mui-table-view-condensed">
				<li class="mui-table-view-cell" style="margin: 0px; padding: 5px 10px 5px 5px;">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-10">
							<h5>评价（5）</h5>
						</div>

					</div>
				</li>
				<li class="mui-table-view-cell" style="margin: 0px; padding: 5px 10px 5px 5px;">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-10">
							<h4 class="mui-ellipsis-2">☆☆☆☆☆</h4>
							<h5>味道很好，很好吃</h5>
							<img src="../../static/img/images/IMG_2239.png" />
							<img src="../../static/img/images/IMG_2239.png" />
						</div>
						<div class="mui-table-cell mui-col-xs-2 mui-text-right">
							<span class="mui-h5">华子凯</span>
						</div>
					</div>
				</li>
				<li class="mui-table-view-cell" style="margin: 0px; padding: 5px 10px 5px 5px;">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-10">
							<h4 class="mui-ellipsis-2">☆☆☆☆☆</h4>
							<h5>味道很好，很好吃</h5>
							<img src="../../static/img/images/IMG_2239.png" />
							<img src="../../static/img/images/IMG_2239.png" />
						</div>
						<div class="mui-table-cell mui-col-xs-2 mui-text-right">
							<span class="mui-h5">华子凯</span>
						</div>
					</div>
				</li>
				<li class="mui-table-view-cell" style="margin: 0px; padding: 5px 10px 5px 5px;">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-10">
							<h4 class="mui-ellipsis-2">☆☆☆☆☆</h4>
							<h5>味道很好，很好吃</h5>
							<img src="../../static/img/images/IMG_2239.png" />
							<img src="../../static/img/images/IMG_2239.png" />
						</div>
						<div class="mui-table-cell mui-col-xs-2 mui-text-right">
							<span class="mui-h5">华子凯</span>
						</div>
					</div>
				</li>
				<li class="mui-table-view-cell" style="margin: 0px; padding: 5px 10px 5px 5px;">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-10">
							<h4 class="mui-ellipsis-2">☆☆☆☆☆</h4>
							<h5>味道很好，很好吃</h5>
							<img src="../../static/img/images/IMG_2239.png" />
							<img src="../../static/img/images/IMG_2239.png" />
						</div>
						<div class="mui-table-cell mui-col-xs-2 mui-text-right">
							<span class="mui-h5">华子凯</span>
						</div>
					</div>
				</li>
				<li class="mui-table-view-cell" style="margin: 0px; padding: 5px 10px 5px 5px;">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-10">
							<h4 class="mui-ellipsis-2">☆☆☆☆☆</h4>
							<h5>味道很好，很好吃</h5>
							<img src="../../static/img/images/IMG_2239.png" />
							<img src="../../static/img/images/IMG_2239.png" />
						</div>
						<div class="mui-table-cell mui-col-xs-2 mui-text-right">
							<span class="mui-h5">华子凯</span>
						</div>
					</div>
				</li>
			</ul>
			<br />
			<br />
			<br />
		</div>

		<footer id="bottomx" class="mui-bar mui-bar-footer">
			<nav class="mui-bar mui-bar-tab">
				<div class="mui-tab-item mui-col-xs-12">
					<a class="mui-tab-item mui-col-xs-3" href="/shopcar">
						<span class="mui-icon iconfont icon-guanzhu"></span>
						<span class="mui-tab-label">关注</span>
					</a>
					<a id="shop_car" href="#" class="mui-tab-item mui-col-xs-3">
						<span class="mui-icon iconfont icon-shop1" style="height: 20px"><span class="mui-badge" >{{.CarCount}}</span></span>
						<span class="mui-tab-label">购物车</span>
					</a>
					<a id="add2car" class="mui-tab-item mui-button-row mui-col-xs-6" href="#" style="background: red;" >
						<h5 style="font-size:20px;color: white;">加入购物车</h5>
					</a>
				</div>

			</nav>
		</footer>
		<script src="../../static/js/mui.min.js"></script>
		<script type="text/javascript" charset="UTF-8">
			mui.init({
			swipeBack: true //启用右滑关闭功能
		});

			// mui('#shop_car').on('tap','.icon-shop1',function(){
			// 	mui.openWindow({
			// 		id:'default',
			// 		url:'http://192.168.80.105:8080/shop_car'
			// 	})
			// });//选择的只是icon这一个选择器，所以点击必须点击中间，范围小，不是很敏感

			document.getElementById('shop_car').addEventListener('tap',function(){
				mui.openWindow({
					id:'shopcarpage',
					show: {
						aniShow: 'pop-in'
					},
					waiting: {
						autoShow: false
					}
				});
				var main = plus.webview.getWebviewById('shopcarpage').parent();
				mui.fire(main,'goshopcar')
				main.show();
				plus.webview.currentWebview().hide();
			});//整一个超链接范围都是tap点击区，反应更迅速
			document.getElementById('add2car').addEventListener('tap',function(){

				var count = document.getElementById('count').value
				var goodsid = {{.GoodsInfo.Goodsid}}
				mui.openWindow({
					id:'buyjumppage',//重写把此处放到jump页处理因为传完值后直接跳转本页的话部分功能会失效，所以采用一个跳转页来刷新
					url:'http://{{.ServerHost}}:{{.ServerPort}}/buyjump?'+'goodsid='+goodsid+'&'+'count='+count,
				});
			});

			// var m_slider = mui("#slider");
			// m_slider.slider({
			// 	interval:3000
			// });
		</script>
	</body>

</html>
